<template>
  <div class="system-settings">
    <el-card>
      <template #header>
        <span>系统设置</span>
      </template>
      
      <el-form :model="settings" label-width="120px">
        <el-form-item label="系统名称">
          <el-input v-model="settings.systemName" />
        </el-form-item>
        <el-form-item label="系统版本">
          <el-input v-model="settings.version" />
        </el-form-item>
        <el-form-item label="维护模式">
          <el-switch v-model="settings.maintenanceMode" />
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="handleSave">保存设置</el-button>
        </el-form-item>
      </el-form>
    </el-card>
  </div>
</template>

<script setup lang="ts">
import { ref, onMounted } from 'vue'

const settings = ref({
  systemName: '考试系统',
  version: '1.0.0',
  maintenanceMode: false
})

const handleSave = () => {
  console.log('保存设置', settings.value)
}

onMounted(() => {
  // 加载系统设置
})
</script>

<style scoped>
.system-settings {
  padding: 20px;
}
</style>

